<template>
	<z-paging ref="paging" v-model="dataList" @query="queryList"
		:loading-more-custom-style="{ paddingBottom: 'env(safe-area-inset-bottom)' }">
		<template #top>
			<view class="zpagin_top">
				<nav-bar :iconLeft="true" />
				<view class="search">
					<custom-search v-model="queryParams.search" @search="refreshList" placeholder="请输入合同名称/合同编号" />
					<uni-data-select style="z-index: 50;" placeholder="请选择分类" v-model="queryParams.classify_id"
						:localdata="classify_list" @change="refreshList" />
				</view>
				<dui-float-ball :pathUrl="`${pageUrl}/compile`" v-if="$hasPerm(['20201'])" />
			</view>
		</template>
		<uni-card v-for="item in dataList" :key="item.id" margin="10px" spacing="0"
			@click="goDetail(item, pageUrl, '20204')">
			<template v-slot:title>
				<uni-list>
					<uni-list-item :title="item.code" :note="item.name" thumbSize="lg">
						<template v-slot:footer>
							<up-tag size="mini" :text="status_list[item.status_display].text" plain plainFill
								:type="status_list[item.status_display].type" />
						</template>
					</uni-list-item>
				</uni-list>
			</template>
			<view class="ctent">合同类型：{{ item.classify_name }}</view>
			<view class="ctent">甲方：{{ item.party_a }}</view>
			<view class="ctent">乙方：{{ item.party_b }}</view>
			<view class="con">
				<view class="ctent">签署日期：{{ item.sign_date }}</view>
				<view class="ctent">生效日期：{{ item.start_date }}</view>
			</view>
			<view class="ctent">到期日期：{{ item.end_date }}</view>
			<view class="con">
				<view class="ctent">创建人：{{ item.create_full_name }}</view>
				<view class="ctent">审核人：{{ item.apply_full_name }}</view>
			</view>
			<view class="con" style="align-items: normal;">
				<view class="ctent" style="flex: none;">备注：</view>
				<view class="ctent">{{ item.desc }}</view>
			</view>
			<view class="con_button" v-if="$hasPerm(['50105'])" v-show="item.status_display == '审核中'"
				@click.stop="hanldAct(item.id)"> 审核
			</view>
		</uni-card>
	</z-paging>
</template>
<script setup>
import { ref, reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import conContractApi from '../../../api/contract/con_contract'
import { goDetail, swipeActPer } from '@/utils/permission'

//作用于新增或编辑后刷新页面数据
uni.$bus.useBusOn('con_apply', refreshList);

//页面header标题

onLoad(option => {
	get_classify_list()
})
const status_list = {
	'已审核': { text: '已审核', type: 'success' },
	'审核中': { text: '审核中', type: 'primary' },
	'已驳回': { text: '已驳回', type: 'error' },
}

//页面跳转路径
const pageUrl = '/views/contract/con_apply';

//查询参数
const queryParams = reactive({
	search: '',
	group_id: '',
	classify: '',
});

//获取paging实例
const paging = ref(null)
const dataList = ref([])
//列表数据方法
function queryList(pageNo, pageSize) {
	const params = {
		page: pageNo,
		page_size: pageSize,
		...queryParams
	}
	conContractApi.get_contract(params).then((res) => {
		paging.value?.complete(res.results);
	})
}

const classify_list = ref([]);
function get_classify_list() {
	conContractApi.get_contract_classify({ page: 1, page_size: 99999 }).then(res => {
		classify_list.value = res.results.map(v => ({
			text: v.name,
			value: v.id
		}))
	})
};

function hanldAct(id) {
	uni.navigateTo({
		url: `${pageUrl}/detail?type=apply&id=${id}`
	})
}

//刷新列表数据方法
function refreshList() {
	paging.value?.reload()
};
</script>

<style lang="scss"></style>